<template>
	<div>
		<h1>共 {{countOrder}} 条购房订单</h1>
		<el-row>
			<el-col :span="4">
				<div class="">订单号</div>
			</el-col>
			<el-col :span="4">
				<div class="">地区名</div>
			</el-col>
			<el-col :span="4">
				<div class="">小区名</div>
			</el-col>
			<el-col :span="4">
				<div class="">联系人以及方式</div>
			</el-col>
			<el-col :span="8">
				<div class=""></div>
			</el-col>
		</el-row>
		<el-row v-for="o in orders" style="margin: 20px 0;">
			<el-col :span="4">
				<div class="">{{o.oid}}</div>
			</el-col>
			<el-col :span="4">
				<div class="">{{getZone(o.information.house.zoneId)}}</div>
			</el-col>
			<el-col :span="4">
				<div class="">{{o.information.house.village}}</div>
			</el-col>
			<el-col :span="4">
				<el-tooltip placement="top">
					<div slot="content">
						<div v-if="o.sid">
							卖家姓名：{{o.information.saler.name}}
							<br />
							卖家联系方式：{{o.information.saler.phone}}
							<br />
						</div>
						<div v-if="o.aid">
							销售经理姓名：{{o.information.admin.name}}
							<br />
							销售经理联系方式：{{o.information.admin.phone}}
						</div>
						
					</div>
					<el-button icon="el-icon-search" circle></el-button>
				</el-tooltip>
			</el-col>
			<el-col :span="8">
				<div class="">
					 <el-button round @click="checkOrder(o.oid,o.sid,o.bid,o.step)">查看订单状态</el-button>
				</div>
			</el-col>
		</el-row>
	</div>
</template>

<script>
	import {
		getMyOrder
	} from '@/api/order'
	export default {
		data() {
			return {
				orders: []
			}
		},
		created() {
			this.getMyOrder()
		},
		methods: {
			async getMyOrder() {
				const res = await getMyOrder(this.$store.getters.info.id)
				if (res.code === 1) {
					this.orders = res.data
				}
			},
			checkOrder(oid,sid,bid,step){
				this.$router.push({
					path: '/myHome/orderDetail',
					query: {
						oid: oid,
						step:step,
						sid:sid,
						bid:bid
					}
				})
			}
		},
		computed: {
			countOrder() {
				if (this.orders) {
					return this.orders.length
				}
			},
			getZone() {
				if (this.$store.getters.zones) {
					return function(zoneId) {
						return this.$store.getters.zones[zoneId - 1].label;
					}
				}
			},
		}
	}
</script>

<style>
</style>
